// 0. 导入vue-router相关函数
import { createRouter,createWebHashHistory } from 'vue-router'

// 1. 定义路由组件.
// 也可以从其他文件导入
import News from '../views/News.vue'
import Game from '../views/Game.vue'
import TieBa from '../views/TieBa.vue'
import Hots from '../components/Hots.vue'
import Area from '../components/Area.vue'

// 2. 定义一些路由
// 每个路由都需要映射到一个组件。
// 我们后面再讨论嵌套路由。
const routes = [
    { 
        // path: '/news/:username', 
        path: '/news', 
        name: 'news',
        redirect: '/news/hots',
        component: News ,
        children: [{
            path: 'hots', 
            component: Hots ,
        },{
            path: 'area', 
            component: Area ,
        }]
    },
    { path: '/game', component: Game },
    { path: '/tieba', component: TieBa },
  ]

  // 3. 创建路由实例并传递 `routes` 配置
// 你可以在这里输入更多的配置，但我们在这里
// 暂时保持简单
const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHashHistory(),
    routes, // `routes: routes` 的缩写
})

router.beforeEach((to, from) => {
    // ...
    console.log('从哪里来',from);
    console.log('到哪里去',to);
    // 返回 false 以取消导航
    return true
})

export default router